﻿@inherits System.Web.Mvc.WebViewPage<MarkdownEditorModel>
@using System.Web.Mvc.Html
@using ClientDependency.Core.Mvc
@using Our.Umbraco.Web.PropertyEditors.Markdown

@{ 
  Html
  .RequiresCssResource(typeof(MarkdownEditor), "Our.Umbraco.Web.PropertyEditors.Markdown.Resources.wmd.css")
  .RequiresJsResource(typeof(MarkdownEditor), "Our.Umbraco.Web.PropertyEditors.Markdown.Resources.Markdown.Converter.js", 1)
  .RequiresJsResource(typeof(MarkdownEditor), "Our.Umbraco.Web.PropertyEditors.Markdown.Resources.Markdown.Sanitizer.js", 2)
  .RequiresJsResource(typeof(MarkdownEditor), "Our.Umbraco.Web.PropertyEditors.Markdown.Resources.Markdown.Editor.js", 3);
}

@if (Model.PreValueModel.Width > 0 && Model.PreValueModel.Height > 0)
{
    <style>
      .wmd-panel { width: @String.Concat(Model.PreValueModel.Width, "px") !important; }
      .wmd-input { height:  @String.Concat(Model.PreValueModel.Height, "px") !important; }
    </style>
}

    <div class="wmd-panel">
        <div id="wmd-button-bar"></div>
        @Html.TextAreaFor(x => Model.Value, 18, 80, new { @id = "wmd-input", @class = "wmd-input" })
    </div>
    <div id="wmd-preview" class="wmd-panel wmd-preview"></div>

    <script type="text/javascript">
      (function () {
        var converter = new Markdown.Converter();
        var editor = new Markdown.Editor(converter);
        editor.run();
      })();
    </script>

